import { Component, OnInit, AfterViewInit, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';
import { Router } from '@angular/router';


@Component({
    selector: 'wit-menu',
    templateUrl: 'menu.component.html',
    styleUrls:['menu.component.scss'],
    encapsulation:ViewEncapsulation.None
})
export class MenuComponent implements OnInit, AfterViewInit {

    @Input() menuConfig: any;
    @Output() menuClick = new EventEmitter<any>();
    constructor(private router: Router) {

    }

    ngOnInit() {

    }
    changeMenu(treeNode) {
        var nodes = document.getElementsByClassName(treeNode.code);
        var activeNode = document.getElementsByClassName('activeNode2')[0];
        if (activeNode != null) activeNode.classList.remove('activeNode2');
        document.getElementById(treeNode.id).classList.add("activeNode2");
        for (var i = 0; i < nodes.length; i++) {
            var className = nodes[i].classList;
            if (className.contains('show')) {
                className.remove('show');
                className.add('hide');
            } else {
                className.remove('hide');
                className.add('show');
            }
        }


    }
    ngAfterViewInit() {
        var nodes = this.menuConfig.menu;
        for (var i = 0; i < nodes.length; i++) {
            var node = document.getElementById(nodes[i].id).getElementsByClassName('nodeIcon')[0];
            node.classList.add(nodes[i].icon);
        }
    }
    activeMenu(e, node) {
        var nodes = document.getElementsByClassName('node_text');
        for (var i = 0; i < nodes.length; i++) {
            nodes[i].classList.remove('activeNode');
        }
        e.target.classList.add("activeNode");
        if (this.menuClick != null) {
            this.menuClick.emit({event:e,node:node});
        }

    }
}